const { defineConfig } = require('@vue/cli-service')
const timeStamp = new Date().getTime()
module.exports = defineConfig({
  transpileDependencies: true,
    publicPath:'./',
    pwa:{
        themeColor: 'none',
        iconPaths: {
            favicon32: 'favicon.png',
            favicon16: 'favicon.png',
            appleTouchIcon: 'favicon.png',
            maskIcon: 'favicon.png',
            msTileImage: 'favicon.png'
        }
    },
    lintOnSave: false,
    chainWebpack: config => {
        config.module
            .rule('css')
            .test(/\.css$/)
            .oneOf('vue')
            .resourceQuery(/\?vue/)
            .use('px2rem')
            .loader('px2rem-loader')
            .options({
                remUnit: 75
            })
    },
    configureWebpack: {
        output: {
            filename: `js/[name].${timeStamp}.js`,
            chunkFilename: `js/chunk.[id].${timeStamp}.js`,
        },
        plugins: [
            // new CompressionPlugin({
            //   test: /\.js$|\.html$|\.css$|\.jpg$|\.jpeg$|\.png/, // 需要压缩的文件类型
            //   threshold: 10240, // 归档需要进行压缩的文件大小最小值，我这个是10K以上的进行压缩
            //   deleteOriginalAssets: true// 是否删除原文件
            // }),
        ]
    },
    css: {
        extract: {
            filename: `css/[name].${timeStamp}.css`,
            chunkFilename: `css/chunk.[id].${timeStamp}.css`,
        },
    }
})